﻿<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="CategoryManager.ascx.cs" Inherits="FreshCms.BackEnd.Controls.Module.Category.CategoryManager" %>

<div id="page-content" class="block">
    <div class="block-header">
        <div class="header-section">
            <a href="javascript:void(0)" class="lnkTab lnkTabActive">Quản lý danh mục</a>
<%--            <a href="javascript:void(0)" class="lnkTab lnkTabActive">&nbsp;|&nbsp;</a>
            <a href="/BackEnd/?ui=<%=panelId %>&sui=1" class="lnkTab">Sắp xếp danh mục</a>--%>
        </div>
        
    </div>


    <div class="col-sm-2"></div>
    <div class="col-sm-9">
        <div class="block">
            <div class="block-title"><h2>Chức năng</h2></div>
            <div class="col-sm-12">
                <div class="col-sm-6">
                    <div class="form-group">
                        <div class="input-group">
                            <span class="input-group-addon"><i class="fa fa-sitemap"></i></span>
                            <asp:TextBox ID="txtCateName" runat="server" CssClass="form-control"></asp:TextBox>
                            <span class="input-group-addon">Tên danh mục</span>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="input-group">
                            <span class="input-group-addon"><i class="gi gi-rotation_lock"></i></span>
                            <asp:DropDownList ID="ddlStatus" runat="server" CssClass="form-control form-control-status" size="1"></asp:DropDownList>
                            <span class="input-group-addon">Trạng thái</span>
                        </div>
                    </div>
                </div>
                <div class="col-sm-6">
                    <div class="form-group">
                        <div class="input-group">
                            <span class="input-group-addon"><i class="gi gi-git_branch"></i></span>
                            <select id="ddlLevel" class="form-control" size="1">
	                            <option selected="selected" value="1">-- Cấp 1 --</option>
	                            <option value="2">-- Cấp 2 --</option>
                            </select>
                            <span class="input-group-addon">Cấp danh mục</span>
                        </div>
                    </div>
                    <div class="form-group" id="frmParentCate" style="display: none;">
                        <div class="input-group">
                            <span class="input-group-addon"><i class="gi gi-package"></i></span>
                            <asp:DropDownList ID="ddlParentCate" runat="server" CssClass="form-control" size="1"></asp:DropDownList>
                            <span class="input-group-addon">Nhóm danh mục cha</span>
                        </div>
                    </div>
                </div>
            </div>

            <div class="form-group text-center">
                <button type="button" id="btnAdd" class="btn btn-sm btn-success"><i class="hi hi-plus mr5"></i>Thêm danh mục</button>
                <button type="button" id="btnPublish" class="btn btn-sm btn-info"><i class="gi gi-file_export mr5"></i>Xuất bản</button>
            </div>
        </div>
    </div>

    <div class="table-responsive">
        <table id="tblParent" class="table">
            <thead>
                <tr>
                    <th class="text-center" style="width: 60px;">
                        #
                    </th>
                    <th class="text-center" style="width: 60px;">
                        Id
                    </th>
                    <th>
                        Tên danh mục
                    </th>
                    <th style="width: 200px;">
                        Trạng thái
                    </th>
                    <th class="text-center" style="width: 200px;">
                        Thao tác
                    </th>
                </tr>
            </thead>
            <tbody>
                <asp:Repeater ID="rpt" runat="server">
                    <ItemTemplate>
                        <tr id="trMain_<%# Eval("CatId") %>" class="parent_cate">
                            <td class="text-center"><%# Container.ItemIndex + 1 %></td>
                            <td class="text-center"><%# Eval("CatId")%></td>
                            <td><%# Eval("CatName")%></td>
                            <td><asp:Label ID="lblStatus" runat="server" Text=""></asp:Label></td>
                            <td class="text-center">
                                <div class="btn-group">
                                    <a href="javascript:void(0)" data-toggle="tooltip" title="" class="btn btn-xs btn-default btn-info"
                                        data-original-title="Đưa lên trên" onclick="OrderCate(<%# Eval("CatId")%>, <%# Eval("CatParentId")%>, 1)"><i class="gi gi-up_arrow"></i></a>
                                    <a href="javascript:void(0)" data-toggle="tooltip" title="" class="btn btn-xs btn-default btn-info"
                                        data-original-title="Chuyển xuống dưới" onclick="OrderCate(<%# Eval("CatId")%>, <%# Eval("CatParentId")%>, 0)"><i class="gi gi-down_arrow"></i></a>
                                    <a href="javascript:void(0)" data-toggle="tooltip" title="" class="btn btn-xs btn-default"
                                        data-original-title="Sửa" onclick="activeExtTR(<%# Eval("CatId") %>)"><i class="gi gi-pen"></i></a>
                                    <div class="btn-group dropup text-left">
                                        <a href="javascript:void(0)" data-toggle="dropdown" class="btn btn-xs btn-default btn-danger dropdown-toggle"><i class="gi gi-remove_2"></i> </a>
                                        <ul class="dropdown-menu dropdown-menu-delete">
                                            <li><a href="javascript:void(0)" onclick="DeleteData(<%# Eval("CatId") %>, '<%# Eval("CatName")%>')" data-toggle="tooltip" data-original-title="Chú ý, xóa Danh mục Cha thì các danh mục Con sẽ và các bài viết thuộc danh mục này sẽ bị xóa theo">Đồng ý</a></li>
                                            <li><a href="javascript:void(0)">Hủy</a></li>
                                        </ul>
                                    </div>
                            
                                </div>
                            </td>
                        </tr>
                        <tr id="trExt_<%# Eval("CatId") %>" style="display:none/*table-row*/;" class="parent_cate trExt">
                            <td class="text-center"><%# Container.ItemIndex + 1 %></td>
                            <td class="text-center"><%# Eval("CatId")%></td>
                            <td><input type="text" id="txtCateName_<%# Eval("CatId") %>" class="form-control" value="<%# Eval("CatName") %>"></td>
                            <td><asp:DropDownList ID="ddlStatus" runat="server" CssClass="form-control form-control-status" rel="status"></asp:DropDownList></td>
                            <td class="text-center">
                                <div class="btn-group">
                                    <a href="javascript:void(0)" data-toggle="tooltip" title="" class="btn btn-xs btn-default btn-success"
                                        data-original-title="Hoàn tất" onclick="UpdateData(<%# Eval("CatId") %>)"><i class="hi hi-ok"></i></a>

                                    <a href="javascript:void(0)" data-toggle="tooltip" title="" class="btn btn-xs btn-default btn-primary" 
                                        data-original-title="Hủy" onclick="activeMainTR(<%# Eval("CatId") %>)"><i class="hi hi-share-alt"></i></a>
                                </div>
                            </td>
                        </tr>
                        <tr>
                            <td colspan="5" style="padding: 0px;">
                                <table id="tblChild_<%# Eval("CatId") %>" class="table table-hover">
                                
                        <asp:Repeater ID="rptChild" runat="server">
                            <ItemTemplate>
                                <tr id="trMain_<%# Eval("CatId") %>">
                                    <td class="text-center" style="width: 60px;">&nbsp;</td>
                                    <td class="text-center" style="width: 60px;"><%# Eval("CatId")%></td>
                                    <td><i class="fa fa-angle-double-right fa-fw ml30"></i><%# Eval("CatName")%></td>
                                    <td style="width: 200px;"><asp:Label ID="lblStatus" runat="server" Text=""></asp:Label></td>
                                    <td class="text-center" style="width: 200px;">
                                        <div class="btn-group">
                                            <a href="javascript:void(0)" data-toggle="tooltip" title="" class="btn btn-xs btn-default btn-info"
                                                data-original-title="Đưa lên trên" onclick="OrderCate(<%# Eval("CatId")%>, <%# Eval("CatParentId")%>, 1)"><i class="gi gi-up_arrow"></i></a>
                                            <a href="javascript:void(0)" data-toggle="tooltip" title="" class="btn btn-xs btn-default btn-info"
                                                data-original-title="Chuyển xuống dưới" onclick="OrderCate(<%# Eval("CatId")%>, <%# Eval("CatParentId")%>, 0)"><i class="gi gi-down_arrow"></i></a>
                                            <a href="javascript:void(0)" data-toggle="tooltip" title="" class="btn btn-xs btn-default"
                                                data-original-title="Sửa" onclick="activeExtTR(<%# Eval("CatId") %>)"><i class="gi gi-pen"></i></a>
                                            <div class="btn-group dropup text-left">
                                                <a href="javascript:void(0)" data-toggle="dropdown" class="btn btn-xs btn-default btn-danger dropdown-toggle"><i class="gi gi-remove_2"></i> </a>
                                                <ul class="dropdown-menu dropdown-menu-delete">
                                                    <li><a href="javascript:void(0)" onclick="DeleteData(<%# Eval("CatId") %>, '<%# Eval("CatName")%>')" data-toggle="tooltip" data-original-title="Chú ý, xóa Danh mục Con thì các bài viết thuộc danh mục này sẽ bị xóa theo">Đồng ý</a></li>
                                                    <li><a href="javascript:void(0)">Hủy</a></li>
                                                </ul>
                                            </div>
                            
                                        </div>
                                    </td>
                                </tr>
                                <tr id="trExt_<%# Eval("CatId") %>" style="display:none/*table-row*/;" class="trExt">
                                    <td class="text-center">&nbsp;</td>
                                    <td class="text-center"><%# Eval("CatId")%></td>
                                    <td>
                                        <input type="text" id="txtCateName_<%# Eval("CatId") %>" class="form-control w50pc" value="<%# Eval("CatName") %>">
                                        <asp:DropDownList ID="ddlParentCate" runat="server" CssClass="form-control w40pc" rel="parent"></asp:DropDownList>
                                    </td>
                                    <td><asp:DropDownList ID="ddlStatus" runat="server" CssClass="form-control form-control-status" rel="status"></asp:DropDownList></td>
                                    <td class="text-center">
                                        <div class="btn-group">
                                            <a href="javascript:void(0)" data-toggle="tooltip" title="" class="btn btn-xs btn-default btn-success"
                                                data-original-title="Hoàn tất" onclick="UpdateData(<%# Eval("CatId") %>)"><i class="hi hi-ok"></i></a>

                                            <a href="javascript:void(0)" data-toggle="tooltip" title="" class="btn btn-xs btn-default btn-primary" 
                                                data-original-title="Hủy" onclick="activeMainTR(<%# Eval("CatId") %>)"><i class="hi hi-share-alt"></i></a>
                                        </div>
                                    </td>
                                </tr>
                            </ItemTemplate>
                        </asp:Repeater>
                        </table>
                            </td>
                        </tr>
                    </ItemTemplate>
                </asp:Repeater>
            </tbody>
        </table>
    </div>
</div>

<script>
    $(function() {
        // format color for drop down list
        FormatColorDropList('<%=ddlStatus.ClientID %>');
        
        // format cho cả list 
        
        $("#tblParent select[rel*='status']").each(function () {
            console.log($(this).attr('id'));
            FormatColorDropList($(this).attr('id'));
            //if ($(this).is(':checked')) {
            //    lstChecked = lstChecked + $(this).attr('name') + ',';
            //}
        });
    });


    // Show or Hiden Parent drop down list on Form
    $('select#ddlLevel').change(function () {
        var optionSelected = $(this).find("option:selected");
        var valueSelected  = optionSelected.val();
        //var textSelected   = optionSelected.text();
        if(valueSelected==2)
            $('#frmParentCate').fadeIn('fast');
        else
            $('#frmParentCate').fadeOut('fast');
        
    });

    $("#btnAdd").bind("click", function () {
        if (!chkTextBox('<%=txtCateName.ClientID %>', 'Bạn phải nhập tên danh mục...')) return false;

        var parentCate;parentCate = 0;
        if($('select#ddlLevel').val()>1)  // neu chon danh muc cap 2
            parentCate = $('select#<%=ddlParentCate.ClientID %>').val();
        
        // call ajax
        var param;
        param = {
            m: "update",
            ui : <%=panelId %>,
            id: 0,
            name: $('#<%=txtCateName.ClientID %>').val(),
            parent: parentCate,
            type: <%=_cateType %>,
            stt: $('#<%=ddlStatus.ClientID %>').val()
        };
        $.ajax({
            url: "/BackEnd/Handler/Category.ashx",
            data: param,
            type: "POST",
            dataType: "json",
            beforeSend: function () {
                jWaiting.callWaiting();
            },
            success: function (data) {
                //console.log(data);
                if (data.Success) {
                    jWaiting.callWaitingMessSuccess('Thêm mới danh mục thành công...', 'reload', true);
                }
                else {
                    jWaiting.callWaitingMessError('Có lỗi: ' + data.Message);
                }
            }
        });
    });

    $("#btnPublish").bind("click", function () {
        // call ajax
        var param;
        param = {
            m: "publish",
            ui : <%=panelId %>,
            type: <%=_cateType %>
        };
        $.ajax({
            url: "/BackEnd/Handler/Category.ashx",
            data: param,
            type: "POST",
            dataType: "json",
            beforeSend: function () {
                jWaiting.callWaiting();
            },
            success: function (data) {
                console.log(data);
                if (data.Success) {
                    jWaiting.callWaitingMessSuccess('Xuất bản danh mục thành công...', '', true);
                }
                else {
                    jWaiting.callWaitingMessError('Có lỗi: ' + data.Message);
                }
            }
        });
    });

    // event Delete Fast in data table
    function DeleteData(id, catename) {
        // call ajax
        var param;
        param = {
            m: "delete",
            ui : <%=panelId %>,
            type: <%=_cateType %>,
            name: catename,
            id: id
        };
        $.ajax({
            url: "/BackEnd/Handler/Category.ashx",
            data: param,
            type: "POST",
            dataType: "json",
            beforeSend: function () {
                jWaiting.callWaiting();
            },
            success: function (data) {
                //console.log(data);
                if (data.Success) {
                    jWaiting.callWaitingMessSuccess('Xóa danh mục thành công...', 'reload', true);
                }
                else {
                    jWaiting.callWaitingMessError('Có lỗi: ' + data.Message);
                }
            }
        });
    }

    // event Update Fast in data table
    function UpdateData(id) {
        var $row = $('#trExt_' + id);
        var catename = $('#txtCateName_' + id).val();
        
        var catparent;catparent = 0;
        if($row.find("select[rel*='parent']").val()>0) catparent = $row.find("select[rel*='parent']").val();
        
        var catstt = $row.find("select[rel*='status']").val();

        // call ajax
        var param;
        param = {
            m: "update",
            ui : <%=panelId %>,
            id: id,
            name: catename,
            parent: catparent,
            type: <%=_cateType %>,
            stt: catstt
        };
        $.ajax({
            url: "/BackEnd/Handler/Category.ashx",
            data: param,
            type: "POST",
            dataType: "json",
            beforeSend: function () {
                jWaiting.callWaiting();
            },
            success: function (data) {
                //console.log(data);
                if (data.Success) {
                    jWaiting.callWaitingMessSuccess('Cập nhật danh mục thành công...', 'reload', true);
                }
                else {
                    jWaiting.callWaitingMessError('Có lỗi: ' + data.Message);
                }
            }
        });
    }

    // event Update Fast in data table
    function OrderCate(id, parent, action) {
        // call ajax
        var param;
        param = {
            m: "order",
            ui : <%=panelId %>,
            id: id,
            parent: parent,
            action: action,
            type: <%=_cateType %>
        };
        $.ajax({
            url: "/BackEnd/Handler/Category.ashx",
            data: param,
            type: "POST",
            dataType: "json",
            beforeSend: function () {
                jWaiting.callWaiting();
            },
            success: function (data) {
                //console.log(data);
                if (data.Success) {
                    jWaiting.callWaitingMessSuccess('Sắp xếp danh mục thành công...', 'reload', true);
                }
                else {
                    jWaiting.callWaitingMessError('Có lỗi: ' + data.Message);
                }
            }
        });
    }

    
</script>